import { doStrategy } from '../operations';
import './style.less';

export default function Strategy(props: any) {
    const { value, onChange } = props;

    const doConfigure = () => {
        doStrategy({ value, onChange });
    };

    return (
        <div className="process-designer-strategy-wrapper">
            <div className="process-designer-strategy-top">
                <div className="process-designer-strategy-top-text">
                    审批超时未处理时，自动发送消息通知
                </div>
                <div className="process-designer-strategy-top-btn" onClick={doConfigure}>
                    配置
                </div>
            </div>
            <div className="process-designer-strategy-bottom">
                {value?.msgType == 'interval' ? '间隔通知，' : '定时通知，'}<br />
                <span>当流程到达审批节点</span>
                （{value?.msgRule?.reminderTime}）{value?.msgRule?.unit == '2' ? '小时' : value?.msgRule?.unit == '1' ? '自然日' : '法定工作日'}
                <span>未处理时，</span><br />
                <span>立即发送催办通知。</span>
                {
                    value?.msgType == 'regular'
                        ?
                        <>
                            <span>推送周期为</span>
                            {
                                value?.pushRule?.map((item: { elementId: string; date: string; unit: string; }, index: number) => {
                                    return (
                                        <span key={item?.elementId} style={{ color: '#333' }}>
                                            （{item?.date}）{item?.unit == '3' ? '周一到周五' : item?.unit == '2' ? '法定工作日' : item?.unit == '1' ? '每天' : '只通知一次'}{index == value?.pushRule?.length - 1 ? '。' : '，'}
                                        </span>
                                    )
                                })
                            }
                        </>
                        :
                        <>
                            <span>每间隔</span>
                            （{value?.pushRule?.reminderTime}） {value?.pushRule?.unit == '2' ? '小时' : value?.pushRule?.unit == '1' ? '自然日' : '法定工作日'}
                            <span>重复通知。</span>
                        </>
                }
            </div>
        </div>
    )
}